class Vue{
    constructor(options){
// t通过属性保存选项的数据
// 吧把data的成员转成getter和setter 注入VUE实例中
// 调用observer对象,监听数据变化
//  调用compiler对象 解析指令和插值表达式

        this.options=options||{}
        this.$data=options.data||{}
        this.$methods = options.methods || {}
        this.$el=typeof options.el==='string'? document.querySelector(options.el):options.el
        this._proxyData(this.$data)
        this._proxyMethods(this.$methods)
        new Observe(this.$data)
        new Compiler(this)
    }
    _proxyData(data){
        console.log(data)
//遍历data的中的属性
        Object.keys(data).forEach(key=>{
            Object.defineProperty(this,key,{
                enumerable:true,
                configurable:true,
                get(){
                    return data[key]
                },
                set(newValue){
                    if(newValue===data[key]){
                        return 
                    }
                    data[key]=newValue
                }
            })
        })
    }

    _proxyMethods(methods) {
        Object.keys(methods).forEach(key => {
          this[key] = this.$methods[key]
        })
      }
}